﻿<template>
	<div class="inner-content list-content">
		<div class="title">
			用户列表
		</div>
		<el-row class="edit-tool">
			<div class="search-group">
				<input type='text' placeholder="搜索商品名称"/><i class="icon"></i>
			</div>
			<el-dropdown @command="handleCommand">
			  <span class="el-dropdown-link">
			    {{listShowString}}<i class="el-icon-caret-bottom el-icon--right"></i>
			  </span>
			  <el-dropdown-menu slot="dropdown">
			    <el-dropdown-item command="user">普通用户</el-dropdown-item>
			    <el-dropdown-item command="waterDeliver">配送员</el-dropdown-item>
			    <el-dropdown-item command="waterStore">水店</el-dropdown-item>
			  </el-dropdown-menu>
			</el-dropdown>
		</el-row>
		<div class="userList" v-show="listShow=='user'">
			<el-table :data='userList' style="width:100%" >
				<el-table-column
				  prop="createTime"
				  label="创建时间"
				 width="120px">
				</el-table-column>

				<el-table-column
				  prop="userId"
				  label="ID号"
				  width="250px">
				</el-table-column>
				
				<el-table-column
				  prop="name"
				  label="用户名"
				  width='200px'>
				</el-table-column>
				
				<el-table-column
				  prop="phoneNumber"
				  label="联系方式"
				  width='130px'>
				</el-table-column>
				
				<el-table-column
				  prop="feidiAccount"
				  label="飞滴号"
				  width='130px'>
				</el-table-column>
				
				<el-table-column
				  label="飞滴号状态"
				  width="130px">
				  	<template scope='scope'>
				  		<span>{{scope.row.feidiAccountStatus ? '已修改' : scope.row.feidiAccountStatus==false?'未修改':'无状态'}}</span>
				  	</template>
				</el-table-column>
				
				<el-table-column
				  label="账号状态"
				  width="120px">
				  	<template scope='scope'>
				  		<span>{{scope.row.accountStatus==0?'账号正常':scope.row.accountStatus==1?'账号异常':'账号已注销'}}</span>
				  	</template>
				</el-table-column>
				
				<el-table-column
				  prop="grade"
				  label="评分"
				  >
				</el-table-column>

				<el-table-column
				  prop="balance"
				  label="余额"
				  >
				</el-table-column>

				<el-table-column
				  prop="deposit"
				  label="押金"
				  >
				</el-table-column>

				<el-table-column
				  prop="presented"
				  label="赠送金额"
				  width="120px">
				</el-table-column>

				<el-table-column
				  prop="freezeBalance"
				  label="冻结金额"
				  width="120px">
				</el-table-column>

				<el-table-column
			      fixed="right"
			      label="操作"
			      width="100">
			      <template scope="scope">
			        <el-button @click="" type="text" size="small">冻结</el-button>
			        <el-button type="text" size="small">封号</el-button>
			      </template>
				</el-table-column>
			</el-table>

			<div class="paging">
			  <el-pagination
			       @current-change='handleCurrentChange'
			       :current-page.sync='currentPage'
			       layout='prev, pager, next, jumper'
			       :total='total'
			       class='pagination'
			       v-show='total'>
			   </el-pagination>
			</div>
		</div>

		<div class="waterDeliver" v-show="listShow=='waterDeliver'">
			<el-table :data='waterDeliverList' style="width:100%" >
				<el-table-column
				  prop="createTime"
				  label="创建时间"
				 width='120px'>
				</el-table-column>

				<el-table-column
				  prop="waterDeliverId"
				  label="ID号"
				  width='250px'>
				</el-table-column>

				<el-table-column
				  prop="name"
				  label="用户名"
				  width='90px'>
				</el-table-column>

				<el-table-column
				  prop="phoneNumber"
				  label="联系方式"
				  width='130px'>
				</el-table-column>

				<el-table-column
				  prop="feidiAccount"
				  label="飞滴号"
				  width='130px'>
				</el-table-column>

				<el-table-column
				  label="飞滴号状态"
				  width='120px'>
				  	<template scope='scope'>
				  		<span>{{scope.row.feidiAccountStatus ? '已修改' : scope.row.feidiAccountStatus==false?'未修改':'无状态'}}</span>
				  	</template>
				</el-table-column>

				<el-table-column
				  prop="age"
				  label="年龄"
				  width='70px'>
				</el-table-column>

				<el-table-column
				  prop="idCardNo"
				  label="身份证号"
				  width='200px'>
				</el-table-column>

				<el-table-column
				  label="账号状态"
				  width='100px'>
				  	<template scope='scope'>
				  		<span>{{scope.row.accountStatus==0?'账号正常':scope.row.accountStatus==1?'账号异常':'账号已注销'}}</span>
				  	</template>
				</el-table-column>

				<el-table-column
				  prop="facialFeature"
				  label="人脸识别特征码"
				  width='200px'>
				</el-table-column>

				<el-table-column
				  prop="contractNo"
				  label="合同号"
				  width='200px'>
				</el-table-column>

				<el-table-column
				  prop="serviceGrade"
				  label="服务分"
				  width='90px'>
				</el-table-column>

				<el-table-column
			      fixed="right"
			      label="操作"
			      width="100">
			      <template scope="scope">
			        <el-button @click="" type="text" size="small">冻结</el-button>
			        <el-button type="text" size="small">封号</el-button>
			      </template>
				</el-table-column>
			</el-table>
			<div class="paging">
			  <el-pagination
			       @current-change='handleCurrentChange'
			       :current-page.sync='currentPage'
			       layout='prev, pager, next, jumper'
			       :total='total'
			       class='pagination'
			       v-show='total'>
			   </el-pagination>
			</div>
		</div>

		<div class="waterStore" v-show="listShow=='waterStore'">
			<el-table :data='waterStoreList' style="width:100%" >
				<el-table-column
				  prop="createTime"
				  label="创建时间"
				 width='120px'>
				</el-table-column>

				<el-table-column
				  prop="modifiedTime"
				  label="修改时间"
				  width='120px'>
				</el-table-column>

				<el-table-column
				  prop="waterStoreId"
				  label="ID号"
				  width='200px'>
				</el-table-column>
				<el-table-column
				  prop="name"
				  label="用户名"
				  width='90px'>
				</el-table-column>
				<el-table-column
				  prop="phoneNumber"
				  label="联系方式"
				  width='130px'>
				</el-table-column>
				<el-table-column
			      label="图片"
			      width="150px">
			      <template scope="scope">
			        <el-button 
			        @click="waterStoreCover(scope.row.coverPhotoUrl)" type="text" size="small">外观图</el-button>
			        <el-button 
			        @click="waterStoreDetail(scope.row.detailPhotoUrl)" type="text" size="small">内部图</el-button>
			      </template>
				</el-table-column>
				<el-table-column
				  prop="serviceGrade"
				  label="服务分"
				  width='90px'>
				</el-table-column>
				<el-table-column
				  prop="address"
				  label="地址"
				  width='210px'>
				</el-table-column>
				<el-table-column
				  prop="detailAddress"
				  label="详细地址"
				  width='300px'>
				</el-table-column>

				<el-table-column
				  label="账号状态"
				  width='150px'>
				  	<template scope='scope'>
				  		<span>{{scope.row.status==0?'认证通过':scope.row.accountStatus==1?'未提交审核':scope.row.accountStatus==2?'审核中':scope.row.accountStatus==3?'审核失败':'账号已注销'}}</span>
				  	</template>
				</el-table-column>



				<el-table-column
				  prop="contact"
				  label="电话"
				 width='150px'>
				</el-table-column>

				<el-table-column
			      fixed="right"
			      label="操作"
			      width="100">
			      <template scope="scope">
			        <el-button @click="" type="text" size="small">冻结</el-button>
			        <el-button type="text" size="small">封号</el-button>
			      </template>
				</el-table-column>
			</el-table>
			<div class="paging">
			  <el-pagination
			       @current-change='handleCurrentChange'
			       :current-page.sync='currentPage'
			       layout='prev, pager, next, jumper'
			       :total='total'
			       class='pagination'
			       v-show='total'>
			   </el-pagination>
			</div>
		</div>

		<el-dialog v-model="picDialogVisible" size="tiny">
		  <img width="100%" :src="dialogImageUrl" alt="水店图">
		</el-dialog>
	</div>
</template>
<script>
	import ListJS from './List.js';
	module.exports = ListJS;
</script>

<style scoped lang='less'>
	@import url(List.less);
</style>